<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Insert title here</title>

	<!-- To avoid horizontal scrolling in this code listing. -->
	<base href="http://ajax.googleapis.com/" />
	
	<!-- Reference the theme's stylesheet on the Google CDN -->
	<link href="/ajax/libs/jqueryui/1.7.2/themes/start/jquery-ui.css" type="text/css" rel="Stylesheet" />
	      
	
	<!-- Reference jQuery and jQuery UI from the google CDN. Remember
	     that the order of these two elements is important -->
	<script src="/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
	<script src="/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js"></script>
	
	<!-- Initialize the tabs when the document is ready -->
	<script type="text/javascript">
	$(document).ready(function() {
	  // See the jQuery UI Tabs documentation for
	  //  more information about how this works.
		$('#tabs').tabs();
	});
  </script>
</head>
<body>


<body>
  <div id="tabs">
    <ul>
      <li><a href="#tab-1">Tab 1</a></li>
      <li><a href="#tab-2">Tab 2</a></li>
      <li><a href="#tab-3">Tab 3</a></li>
    </ul>
 
    <div id="tab-1">
      <p>These tabs were created with JavaScript, CSS, and 
        images hosted on Google's AJAX APIs CDN.</p>
 
      <p>Thanks, Google!</p>
    </div>
    <div id="tab-2">
      <!-- Tab 2's content goes here. -->
      hello from tab 2
    </div>
    <div id="tab-3">
      <!-- Tab 3's content goes here. -->
      hello from tab 3
    </div>
  </div>
</body>
</html>


</body>
</html>